@use "sass:color";
@import "./variables";

.hljs, %hljs {
  display: block;
  overflow-x: auto;
  padding: 0.5em;
  background: $code-bg;
  color: #fff;

  &.language-shell, &.language-better-shell {
    // .bash:first-of-type {
    :not(.bash) + .bash {
      color: #d2a8e0;
    }
  }
}

pre {
  @extend %hljs;

  border-radius: $border-radius;
  padding: $spacer;
  font-size: $font-size-small;
  margin: $spacer * 1.5 0;
}

.hljs-keyword,
.hljs-selector-tag,
.hljs-tag {
  color: #d2a8e0;
}

// ???
.hljs-template-tag {
  color: #f00;
}

.hljs-number {
  color: #6cb9f0;
}

.hljs-variable,
.hljs-template-variable,
.hljs-attribute,
.hljs-literal {
  color: color.adjust(#6cb9f0, $lightness: 20%);
}

// ???
.hljs-subst {
  color: #f00;
}

.hljs-title,
.hljs-name,
.hljs-selector-id,
.hljs-selector-class,
.hljs-section,
.hljs-type {
  color: #f0a46c;
}

.hljs-symbol,
.hljs-bullet,
.hljs-link {
  color: #d2a8e0;
}

/* stylelint-disable selector-class-pattern */
.hljs-deletion,
.hljs-string,
.hljs-built_in,
.hljs-builtin-name {
  color: #6cb9f0;
}
/* stylelint-enable selector-class-pattern */

.hljs-addition,
.hljs-comment,
.hljs-quote,
.hljs-meta {
  color: $gray-500;
}

.hljs-emphasis {
  font-style: italic;
}

.hljs-strong {
  font-weight: bold;
}
